{% extends "base.html" %}

{% block title %}编辑签到{% endblock %}

{% block head %}
<link href="{{ static_url('components/bootstrap/dist/css/bootstrap.min.css') }}" rel="stylesheet" type="text/css">
<link href="{{ static_url('har/editor.css') }}" rel="stylesheet" type="text/css">
<script src="{{ static_url('components/jquery/dist/jquery.min.js') }}"></script>
<script src="{{ static_url('components/bootstrap/dist/js/bootstrap.min.js') }}"></script>
<script src="{{ static_url('components/angularjs/angular.min.js') }}"></script>
{% endblock %}

{% block body %}
<script>
  TPLID={{ tplid or 0 }};
  HASUSER={{ 1 if current_user else 0 }};
</script>
{% raw %}
<div class="container">
  <div class="row" ng-controller="EntryList">
    <div class="col-md-3" id="editor-switch">
      <a class="h1-index" href="/">
        <h1 class="text-center">签到<sup>alpha</sup></h1>
      </a>
      
      <!--checked switch-->
      <div class="list-group">
        <a ng-class="{active: !filter.checked && !filter.recommend}" class="list-group-item" href="javascript:void(0);" ng-click='filter.recommend=undefined;filter.checked=undefined'>
          <span class="badge">{{ har.log.entries.length }}</span>
          所有请求
        </a>
        <a ng-class="{active: filter.checked}" class="list-group-item" href="javascript:void(0);" ng-click='filter.recommend=undefined;filter.checked=true'>
          <span class="badge">{{ (har.log.entries|filter:{checked:true}).length }}</span>
          已选择请求
        </a>
        <a ng-class="{active: filter.recommend}" class="list-group-item text-right" href="javascript:void(0);" ng-click='recommend();filter.recommend=true;filter.checked=undefined'>
          推荐关联请求 &gt;
        </a>
      </div>

      <!-- mime type -->
      <div class="list-group">
        <a href="javascript:void(0);" class="list-group-item"
          ng-repeat="(name, key) in {
            All: undefined,
            Documents: 'document',
            Javascript: 'javascript',
            Styles: 'style',
            Images: 'image',
            Media: 'media',
            Others: 'other'
          }"
          ng-class="{active: filter.filter_mimeType == key}"
          ng-click="filter.filter_mimeType = key">
          <span class="badge">{{ (har.log.entries | filter: badge_filter({filter_mimeType: key})).length }}</span>
          {{ name }}
        </a>
      </div>

      <!-- xhr && cookie -->
      <div class="list-group">
        <a href="javascript:void(0);" class="list-group-item"
          ng-class="{active: filter.filter_xhr}"
          ng-click="filter.filter_xhr = filter.filter_xhr ? undefined : true">
          <span class="badge">{{ (har.log.entries | filter: badge_filter({filter_mimeType: filter.filter_mimeType, filter_xhr: true})).length }}</span>
          XMLHttpRequest
        </a>
        <a href="javascript:void(0);" class="list-group-item"
          ng-class="{active: filter.filter_set_cookie}"
          ng-click="filter.filter_set_cookie = filter.filter_set_cookie ? undefined : true">
          <span class="badge">{{ (har.log.entries | filter: badge_filter({filter_mimeType: filter.filter_mimeType, filter_set_cookie: true})).length }}</span>
          Set-Cookie
        </a>
        <a href="javascript:void(0);" class="list-group-item"
          ng-class="{active: filter.filter_variables}"
          ng-click="filter.filter_variables = filter.filter_variables ? undefined : true">
          <span class="badge">{{ (har.log.entries | filter: badge_filter({filter_mimeType: filter.filter_mimeType, filter_variables: true})).length }}</span>
          请求中有变量
        </a>
      </div>

    </div>

    <!-- entries list -->
    <div class="col-md-9" id="entries">
      <div ng-switch="(har.log.entries | filter: {checked: true}).length">
        <div class="alert alert-info" role="alert" ng-switch-when="0">
          请分析定位 <strong>签到</strong> 请求，在请求前打勾，如果推荐的请求中没有，请在右侧筛选
        </div>
        <div class="alert alert-info" role="alert" ng-switch-when="1">
          您可以再次点击
          <a href="javascript:void(0);" ng-click="recommend();filter.recommend=true;filter.checked=undefined">推荐关联请求</a>
          ，帮助定位 <strong>登录</strong> 请求，点击 URL 编辑请求，为其加入用户名、密码变量
        </div>
        <div class="alert alert-info" role="alert" ng-switch-default>
          完成登录请求定位后，请<strong>依次</strong>点击每个
          <a href="javascript:void(0);" ng-click="filter.recommend=undefined;filter.checked=true">已选择请求</a>
          ，切换到 <strong>测试</strong> 面板，对请求进行测试。
        </div>
      </div>

      <div class="list-group">
        <li class="list-group-item pageref"
          ng-repeat-start="entry in har.log.entries | filter: filter | filter: track_item()"
          ng-if="filted[$index-1].pageref != entry.pageref">
          {{ entry.pageref }}
        </li>

        <a href="javascript:void(0);" class="list-group-item entry" ng-repeat-end>
          <div class="entry-checked">
            <input ng-model="entry.checked" ng-click="save_change()" type="checkbox">
          </div>
          <span class="label pull-right {{ status_label(entry.response.status) }}">{{ entry.response.status }}</span>
          <span class="label pull-right label-info" ng-show="entry.filter_set_cookie">set-cookie</span>
          <span class="label pull-right label-warning" ng-show="entry.filter_xhr">XHR</span>
          <span class="label pull-right label-primary" ng-repeat="variable in variables_in_entry(entry)"><span ng-non-bindable>{{ </span>{{ variable }}<span ng-no-bindable> }}</span></span>
          <span class="label label-default pull-right" ng-repeat="tag in entry.check_tag">{{ tag }}</span>
          <span class="label" ng-class="{
            'label-warning': (entry.request.method != 'GET'),
            'label-primary': (entry.request.method == 'GET')
            }">{{ entry.request.method }}</span>
          <span class="entry-url" ng-click="edit(entry)">{{ entry.request.url }}</span>
        </a>

        <li class="list-group-item" ng-if="filted.length == 0">过滤条件下没有请求</li>
      </div>
      <!-- ./entries list -->

      <div class="text-right">
        <a id="download-har" target="_blank" class="btn btn-default" ng-click="download()">下载</a>
        <button class="btn btn-default" data-toggle="modal" data-target="#test-har" ng-click="pre_save()">测试</button>
        <button ng-if="!readonly" class="btn btn-primary" data-toggle="modal" data-target="#save-har" ng-click="pre_save()">保存</button>
      </div>

      <!-- test har -->
      <div class="modal fade" id="test-har">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <h4 class="modal-title">测试HAR</h4>
            </div>
            <div class="modal-body">
              <div class="result"></div>
              <div class="form-horizontal" role="form">

                <div class="form-group" ng-repeat="var in env">
                  <label class="col-sm-3 control-label">{{ var.name }}</label>
                  <div ng-if="var.name.toLowerCase() != 'cookie'" class="col-sm-9">
                    <input ng-model="var.value">
                  </div>
                  <div ng-if="var.name.toLowerCase() == 'cookie'" class="col-sm-9">
                    <input ng-model="var.value">
                    <a ng-if="setting.siteurl" href="javascript:void(0)" data-toggle="get-cookie" data-site="{{ setting.siteurl.indexOf('http') == 0 ? setting.siteurl : 'http://'+setting.siteurl }}" data-cookie="">点击获取</a>
                  </div>
                </div>

              </div>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-primary" data-loading-text="loading..." ng-click="test()">测试</button>
            </div>
          </div>
        </div>
      </div>

      <!--save modal -->
      <div class="modal fade" id="save-har">
        <div class="modal-dialog">
          <div class="modal-content">
            <div class="modal-header">
              <h4 class="modal-title">保存HAR</h4>
            </div>
            <div class="modal-body">
              <div class="alert alert-danger" role="alert" style="display: none;">
                <strong>Oh snap!</strong> Change a few things up and try submitting again.
              </div>
              <div class="alert alert-info" role="alert" style="display: none;">
                <strong>Oh snap!</strong> Change a few things up and try submitting again.
              </div>
              <div class="form-horizontal" role="form">

                <div class="form-group">
                  <label class="col-sm-3 control-label">网站名</label>
                  <div class="col-sm-9">
                    <input ng-model="setting.sitename">
                  </div>
                </div>

                <div class="form-group">
                  <label class="col-sm-3 control-label">网站网址</label>
                  <div class="col-sm-9">
                    <input ng-model="setting.siteurl">
                  </div>
                </div>

                <div class="form-group">
                  <label class="col-sm-3 control-label">备注</label>
                  <div class="col-sm-9">
                    <input ng-model="setting.note">
                  </div>
                </div>

                <div class="form-group">
                  <label class="col-sm-3 control-label">间隔</label>
                  <div class="col-sm-9">
                    <select ng-model="setting.interval">
                      <option value=604800>每周</option>
                      <option value=259200>每3天</option>
                      <option value="">每天</option>
                      <option value=43200>每12小时</option>
                      <option value=21600>每6小时</option>
                      <option value=18000>每5小时</option>
                      <option value=10800>每3小时</option>
                      <option value=7200>每2小时</option>
                      <option value=3600>每小时</option>
                    </select>
                  </div>
                </div>

              </div>
            </div>
            <div class="modal-footer">
              <button type="button" class="btn btn-primary" data-loading-text="保存中..." ng-click="save()">保存</button>
            </div>
          </div>
        </div>
      </div>
      <!-- /.save modal -->
      
    </div>

{% endraw %}
{% include "har/entry_editor.html" %}
{% raw %}

  <!-- upload modal -->
  <div class="modal fade" id="upload-har" ng-controller="UploadCtrl">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <h4 class="modal-title">上传HAR</h4>
          <a href="https://github.com/binux/qiandao/blob/master/docs/har-howto.md" id="har-guide" class="btn btn-default" target="_blank">使用帮助</a>
        </div>
        <div class="modal-body">
          <div class="alert alert-danger" role="alert" style="display: none;">
            <strong>Oh snap!</strong> Change a few things up and try submitting again.
          </div>
          <div class="alert alert-info" role="alert" ng-if="local_har">
            您有一个正在编辑的 HAR 文件（{{ local_har }}），是否打开？
            <a href="javascript:void(0);" ng-click="load_local_har()">[ 打开 ]</a> /
            <a href="javascript:void(0);" ng-click="delete_local()">[ 删除 ]</a>
          </div>
          <div class="form-horizontal" role="form">
            <div class="form-group">
              <label class="col-sm-3 control-label">上传 HAR 文件</label>
              <div class="col-sm-9">
                <input type="file">
              </div>
            </div>
            <div class="form-group">
              <label class="col-sm-3 control-label">用户名</label>
              <div class="col-sm-9">
                <input ng-model="username">
                <p class="help-block">登录目标网站时输入的用户名，用于变量替换</p>
              </div>
            </div>
            <div class="form-group">
              <label class="col-sm-3 control-label">密码</label>
              <div class="col-sm-9">
                <input ng-model="password">
                <p class="help-block">登录目标网站时输入的密码，用于变量替换</p>
              </div>
            </div>
          </div>
        </div>
        <div class="modal-footer">
          <button type="button" class="btn btn-primary" data-loading-text="Loading..." ng-click="upload()">上传</button>
        </div>
      </div>
    </div>
  </div><!-- /.modal -->
</div>
<script>
  seajs.use('/static/har/editor', function(main) {
    main.init()
  });
</script>
{% endraw %}
{% endblock %}
